<template>
    <div class="twoDeclares">
        <div class="topDeclare">
            <div class="gridRowContainer">
                <div class="topLeft">
                    <h1>Relocation</h1>
                    <p>Moving your life over to a new country can be daunting, but you won’t be doing it yourself! Our
                        Relocation Team is here to help smooth the way for you and any loved ones who will be coming
                        with you – be it family members or your beloved pets.</p>
                    <p>And if you do bring loved ones with you, we will also do our best to help them find their place
                        in the new city as you settle into your new role. As well as offering language classes, yoga,
                        and fun activities such as sushi-making, our spouse network is made up of locals and expats and
                        is a great source of information and support.</p>
                </div>
                <div class="topRight">
                    <img src="/src/assets/img/careers/joining/builder.webp" alt="">
                </div>
            </div>
        </div>
        <div class="bottomDeclare">
            <div class="gridRowContainer">
                <div class="bottomLeft">
                    <img src="/src/assets/img/careers/joining/goblin.webp" alt="">
                </div>
                <div class="bottomRight">
                    <h1>Onboarding</h1>
                    <p>Before you start we'll send you a lite info package so you'll know what to expect during
                        your first few days. You'll also be given a buddy (sometimes two!) who can show you the
                        ropes and answer important questions, like where we eat lunch. Later, you'll join one of
                        our monthly onboarding sessions where all our new hires from around the globe come to
                        Helsinki to meet the teams. You'll have a chance to not only hear what each team does,
                        but how they do it in the unique Supercell way. And before the week is done, we'll take
                        your mugshot and happily add your photo to our Polaroid wall.</p>
                </div>
            </div>
        </div>
    </div>
</template>

<script setup>

</script>

<style scoped>
.topDeclare {
    background: linear-gradient(rgb(36, 95, 198), rgb(40, 135, 240));
}

.topDeclare, .bottomDeclare {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;

}

.gridRowContainer {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

.topLeft, .bottomRight {
    padding: 80px 0;
    width: 40%;
}

.topLeft h1, .bottomRight h1 {
    font-size: 34px;
    font-weight: bolder;
    margin: 25px 0;
    text-align: center;
    text-transform: uppercase;
}

.topLeft p, .bottomRight p {
    font-size: 18px;
    line-height: 1.5;
    margin-bottom: 30px;
}

.topLeft {
    color: #fff;
}

.bottomRight {
    color: #000;
}

.topRight img, .bottomLeft img {
    display: block;
    margin-top: -7%;
    z-index: 9;
    margin-bottom: 50px;
}
</style>